<template>
  <yd-layout>
    <v-header slot="navbar" title="我的订单">
      <div slot="left" @click="back">
        <yd-navbar-back-icon></yd-navbar-back-icon>
      </div>
    </v-header>
    <yd-tab v-model="activeIndex">
      <yd-tab-panel v-for = "(item, index) in tabLi" :key = "index" :label = "item"/>
    </yd-tab>
    <div :class="['comm_con', 'yd-tab-panel-item', {'yd-tab-active': activeIndex === index}]" v-for = "(item, index) in tabLi" :key = "item">
      <div class="order_li"></div>
    </div>
  </yd-layout>
</template>
<script>
export default {
  name: 'order',
  data () {
    return {
      activeIndex: 0,
      tabLi: ['全部', '待支付', '待收货', '已完成', '待评价'],
      orderLi: []
    }
  },
  watch: {
    activeIndex: {
      immediate: true,
      handler (val) {
        this.init(val)
      }
    }
  },
  methods: {
    init (val) {
      this.orderLi = [{
        title: '您的爱心订单',
        state: '0',
        imgSrc: 'http://img1.shikee.com/try/2016/06/21/10172020923917672923.jpg',
        num: 0,
        price: '5000积分+¥99.00'
      }]
    }
  }
}
</script>
<style lang="scss" scoped></style>
